<template lang="pug">
.wrapper(style="padding: 60px 0;")
  .ui.container
    router-view
</template>

<script>
import store from './vuex/store'

export default {
  name: 'app',
  store,
  components: {},
  methods: {},
  data() {
    return {}
  },
  created() {},
  ready() {},
}
</script>

<style lang="sass">
.wide-input
  border: none !important
  padding: 0 !important
.top
  margin-top: 0 !important
  top: 0 !important
.no-wrap
  white-space: nowrap
.break-all
  word-break: break-all
.full-center
  width: 100%
  text-align: center
.line
  width: 100%
  height: 1px
  background-color: black
.img-wrap
  width: 150px
  height: 150px
  border: 1px solid #eee
  align-items: center
  justify-content: center
  display: flex
.img
  max-width: 150px !important
  max-height: 150px !important
.hidden
  display: none
.ui.menu .ui.dropdown .menu>.active.item.normal, .ui.menu .ui.dropdown .menu>.selected.item.normal
  background-color: inherit !important
  color: inherit !important
  font-weight: inherit !important
.handle
  cursor: move
  cursor: -webkit-grabbing
.ghost
  opacity: .5
  background: #C8EBFB
.red
  color: red !important
.transparent
  opacity: 0 !important
.square-card
  width: 100px !important
  height: 100px !important
  margin: 15px !important
.border-left
  border-left: 1px solid rgba(34,36,38,.1) !important
.border-right
  border-right: 1px solid rgba(34,36,38,.1) !important
.no-border-right
  border-right: none !important
.no-border-left
  border-left: none !important
.active-item
  background-color: rgba(0,0,0,.05) !important
  color: rgba(0,0,0,.95) !important
.narrow
  width: 400px !important
.plain-text
  font-weight: normal !important
  font-size: 14px !important
.product-card
  width: 100px !important
  height: 100px !important
.detail-sidebar
  width: 66.66% !important
  background: white !important
  padding: 10px !important
.no-margin
  margin: 0 !important
.no-padding
  padding: 0 !important
.pointer
  cursor: pointer !important
  -webkit-user-select: none
// .pointer:hover
//   background: rgba(0,0,0,.03) !important
//   color: rgba(0,0,0,.5) !important
.gray-bg
  background-color: rgba(40,40,40,.3) !important
.gray
  color: rgba(40,40,40,.3) !important
.inline-title
  font-weight: bold
  margin-right: 10px
select
  outline: 0
.margin-center
  margin-left: auto !important
  margin-right: auto !important
.flex
  display: flex
.flex.x1
  flex: 1
.flex.x2
  flex: 2
.flex_1
  flex: 1
.flex_2
  flex: 2
.flex.dc
  flex-direction: column
.flex.dr
  flex-direction: row
.flex.jc
  justify-content: center
.flex.je
  justify-content: flex-end
.flex.js
  justify-content: flex-start
.flex.jsb
  justify-content: space-between
.flex.ac
  align-items: center
.flex.ae
  align-items: flex-end
.flex.as
  align-items: flex-start
.flex.wrap
  flex-wrap: wrap !important
.flex.inline
  display: inline-flex
</style>
